import Taro, { Component } from '@tarojs/taro'
import { View, Image, Text } from '@tarojs/components'
import { DNavBar } from '@/components'
import { AtButton } from 'taro-ui'
import sdk from '@/common/sdk'
import http from '@/api'
import './index.scss'

export default class Authentication extends Component {
  state = {
    title: '认证信息',
    personIcon: require('../../../assets/images/icon／员工认证@2x.png'),
    arrIcon: require('../../../assets/images/icon／基础／01right@2x.png'),
    enterpriseIcon: require('../../../assets/images/icon／企业认证@2x.png'),
    inreviewIcon: require('../../../assets/images/icon／审核中@2x.png'),
    verifiedIcon: require('../../../assets/images/icon／已认证@2x.png'),
    refusedIcon: require('../../../assets/images/icon／被拒绝@2x.png'),
    removeIcon: require('../../../assets/images/icon／被移除@2x.png'),
    PersonAuthStatus: null, // 个人认证状态（0未认证 1待审核 2认证通过 3认证不通过）
    enterpriseAuthStatus: null, // 企业认证状态（0待审核，1审核通过，2审核未通过 3被移出企业，4未认证）
    imIdcard: '', // 被移除时显示的企业名称
    userInfo: '',
    eaIsAppro: ''
  }

  componentDidShow() {
    const { token } = this.$router.params
    if (token) {
      localStorage.setItem('X-Auth0-Token', token)
    }
    this.getUserInfo()
  }

  async getUserInfo() {
    let userInfo = await http.myselfDetail()
    let { eaIsAppro } = await http.getConfirmInfo()
    let enterpriseAuthStatus = ''
    let { authStatus: PersonAuthStatus, imIdStatus, imIsAppro, imIdcard } = userInfo
    // imIsAppro 员工审核状态
    if (eaIsAppro != 3) {
      // 企业认证状态
      enterpriseAuthStatus = eaIsAppro
    } else {
      // 员工审核状态
      if (imIsAppro != '') {
        enterpriseAuthStatus = imIsAppro
      } else {
        enterpriseAuthStatus = 4
      }
    }

    this.setState({
      PersonAuthStatus,
      imIdcard,
      userInfo,
      enterpriseAuthStatus,
      eaIsAppro
    })
  }

  toEnterpriseDetail() {
    let { eaIsAppro } = this.state
    if (eaIsAppro != 3) {
      Taro.navigateTo({
        url: '/pages/myinfo/entManageDetail'
      })
    } else {
      Taro.navigateTo({
        url: '/pages/myinfo/entEmployeeDetail'
      })
    }

  }

  toPersonDetail() {
    Taro.navigateTo({
      url: '/pages/myinfo/personDetail'
    })
  }

  // 跳转个人认证
  toPersonalcert() {
    let { PersonAuthStatus, userInfo } = this.state
    if (PersonAuthStatus == 3) {
      Taro.navigateTo({
        url: `/pages/myinfo/personalcert?id=${userInfo.id}`
      })
    } else {
      Taro.navigateTo({
        url: `/pages/myinfo/personalcert`
      })
    }
  }

  handleAuth() {
    let { eaIsAppro } = this.state
    if (eaIsAppro == 2) {
      // 企业认证被拒绝
      Taro.navigateTo({
        url: '/pages/enterpriseform/enterpriseform?rep=true'
      })
    } else {
      Taro.navigateTo({
        url: '/pages/myinfo/enterprisecert'
      })
    }
  }

  toHome() {
    var u = navigator.userAgent;
    var isAndroid = u.indexOf('Android') > -1 || u.indexOf('Adr') > -1; //android终端
    var isiOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/); //ios终端

    if (isAndroid) {
      if (window.bridge) {
        // 跳转首页
        return sdk.setSkipCustom(0)
      }
    }

    if (isiOS) {
      return window.webkit.messageHandler.backToHomepage()
    }
  }

  render() {
    const {
      title,
      personIcon,
      arrIcon,
      inreviewIcon,
      enterpriseIcon,
      PersonAuthStatus,
      verifiedIcon,
      refusedIcon,
      enterpriseAuthStatus,
      removeIcon,
      imIdcard,
      userInfo
    } = this.state
    return (
      <View className="authentication">
        <DNavBar title={title}></DNavBar>

        <View className="container">
          {/* 个人认证 */}
          <View className="auth_item">
            <View className="auth_item_content">
              {/* 未认证不能跳转详情页 */}
              <View className="left" onClick={PersonAuthStatus != 0 ? this.toPersonDetail.bind(this) : () => { }}>
                <View className="left_title">
                  <Image src={personIcon} className="icon"></Image>
                  <Text className="left_title_text">个人认证</Text>
                  {
                    PersonAuthStatus != 0 && <Image src={arrIcon} className="arrIcon"></Image>
                  }
                </View>
                <View className="text">完成身份认证，获得个人专属标识</View>
              </View>
              <View className="right">
                {/* 审核中 */}
                {PersonAuthStatus == 1 && <Image src={inreviewIcon} className="statusIcon"></Image>}
                {/* 认证通过 */}
                {PersonAuthStatus == 2 && <Image src={verifiedIcon} className="statusIcon"></Image>}
                {/* 认证不通过 */}
                {PersonAuthStatus == 3 && <Image src={refusedIcon} className="statusIcon"></Image>}

                {(PersonAuthStatus == 0 || PersonAuthStatus == 3) && <View className="btn" onClick={this.toPersonalcert.bind(this)}>{PersonAuthStatus == 3 ? '重新认证' : '去认证'}</View>}
              </View>
            </View>
          </View>

          {/* 企业认证 */}
          <View className="auth_item">
            <View className="auth_item_content">
              <View className="left" onClick={enterpriseAuthStatus != 4 ? this.toEnterpriseDetail.bind(this) : () => { }}>
                <View className="left_title">
                  <Image src={enterpriseIcon} className="icon"></Image>
                  <Text className="left_title_text">企业认证</Text>
                  {
                    enterpriseAuthStatus != 4 && <Image src={arrIcon} className="arrIcon"></Image>
                  }
                </View>
                <View className="text">上传营业执照及与营业执照公司名称一致的门店照片等，认证成功后可发布车源、寻车等操作</View>
              </View>
              <View className="right">
                {/* 审核中 */}
                {enterpriseAuthStatus == '0' && <Image src={inreviewIcon} className="statusIcon"></Image>}
                {/* 认证成功 */}
                {enterpriseAuthStatus == 1 && <Image src={verifiedIcon} className="statusIcon"></Image>}
                {/* 被拒绝 */}
                {enterpriseAuthStatus == 2 && <Image src={refusedIcon} className="statusIcon"></Image>}
                {/* 被移除 */}
                {enterpriseAuthStatus == 3 && <Image src={removeIcon} className="statusIcon"></Image>}
                {/* 添加空标签让认证按钮下去 */}
                {enterpriseAuthStatus == 4 && <Text></Text>}

                {
                  (enterpriseAuthStatus == 4 || enterpriseAuthStatus == 2) && <View className="btn" onClick={this.handleAuth.bind(this)}>{enterpriseAuthStatus == 2 ? '重新认证' : '去认证'}</View>
                }
              </View>
            </View>
            {
              enterpriseAuthStatus == 3 && <View className="romve">
                <View className="text">{imIdcard}</View>
                <View className="btn" onClick={() => {
                  Taro.navigateTo({
                    url: '/pages/myinfo/enterprisecert'
                  })
                }}>重新认证</View>
              </View>
            }
          </View>
        </View>

        <AtButton onClick={this.toHome.bind(this)}>回到首页</AtButton>
      </View>
    )
  }
}
